<template>
  <div>
    <hr />
    <!-- <h1 v-uc="info"></h1> -->
    <h1>{{ info }}</h1>
    <!-- bind 和 inserted的区别 -->
    <input type="text" v-focus />
    <hr />
  </div>
</template>

<script>
export default {
  data() {
    return {
      info: "GUO NIAN SHOU LE DUO SHAO QIAN!!",
    };
  },
  directives: {
    //   bind 和inserted都可以进行绑定指令时进行逻辑处理，但是某些时刻下bind不可以 inserted可以
    // bind在inserted之前执行
    // bind在DOM树绘制前调用 inserted在DOM树之后调用
    // 使用inserted比较稳妥些

    focus: {
      /* bind(el) {
        console.log(11111);
        // el还没有 
        el.focus();
      }, */
      inserted(el) {
        el.focus();
      },
    },
  },
  /* 
  vue  数据驱动视图 一般不直接操作DOM元素
  可以操作DOM
  ref
  ref 为某个元素注册一个唯一的标识 $refs属性可以获取到这个元素对象
  元素的js六种方法获取DOM
  id
  class
  name
  tagname
  querySelector
  querySelectorAll

  伪数组 和真数组

  jquery获取DOM元素$('选择器')

  
  
  */
};
</script>

<style lang="scss" scoped>
</style>